<template>
    <div>
        <el-card shadow="always" :body-style="{ padding: '20px' }" style="width: 80vw; margin: auto; ">
            <div>
                就诊时间： <el-date-picker v-model="date" value-format="YYYY-MM-DD" type="date" placeholder="统计时间" />
                <el-button type="primary" size="default" @click="getData">测试</el-button>

            </div>
            <div style="margin-top: 30px;">
                <el-card shadow="always" :body-style="{ padding: '20px' }">
                    <div ref="genderStats" style="width: 100%; height: 40vh;">

                    </div>
                </el-card>
            </div>
            <el-table :data="tadaTable" :header-cell-style="{backgroundColor:'#d573f4',color:'#606266'}" >
                <el-table-column type="index" width="50" />
                <el-table-column label="初诊" prop="vist" />
                <el-table-column label="复诊" prop="visted" />
                <el-table-column label="合计" prop="amunt" />
            </el-table>
        </el-card>
    </div>
</template>

<script lang="ts" setup>
import { ref, onMounted } from 'vue';
import * as echarts from 'echarts';
import { listJob } from "../../../../api/statistics/test"
import { patientVisitDistributed } from "../../../../api/report/patientstats"
const test = () => {
    // 小于三使用插槽 大于三·输出
    // console.log(parseInt("性别") < 3);
    // console.log(parseInt("2") < 3);
    console.log("test");
    
    patientVisitDistributed(date.value);
}
const tadaTable = ref([] as any)
const echartsData = ref([] as any)
const date = ref("")
const genderStats = ref()
const getData = async () => {
    echartsData.value = []
    tadaTable.value = [];
   const res = await patientVisitDistributed(date.value)
   tadaTable.value.push(res.data.tablee) ;
   echartsData.value = res.data.echarts
    setec()
}

function setec() {
    var rateChart = echarts.dispose(genderStats.value)
    if (rateChart != null && rateChart != "" && rateChart != undefined) {
        rateChart.dispose();//销毁
    }
    var genderStatsV = echarts.init(genderStats.value)
    var option = {
        tooltip: {
            trigger: 'item'
        },

        legend: {
            top: '1%',
            left: 'center'
        },
        series: [
            {
                name: 'Access From',
                type: 'pie',
                radius: ['30%', '70%'],
                avoidLabelOverlap: false,
                emphasis: {
                    label: {
                        show: true,
                        fontSize: 30,
                        fontWeight: 'bold'
                    }
                },
                label: {
                    formatter: '{d}%\n{b}\{c}',// 显示百分比，
                },
                // 指示折现
                labelLine: {
                    normal: {
                        show: true,
                        legend: 8,//第一条折现
                        legend2: 15,//第二条折现
                        lineStyle: {
                            color: "#166AC1"//折现颜色
                        },
                    }
                },
                data: echartsData.value
            }
        ]
    }
    genderStatsV.setOption(option, true)
}
function formaData(timer) {
    const year = timer.getFullYear()
    var month = timer.getMonth() + 1 // 由于月份从0开始，因此需加1
    var day = timer.getDate() 
    month = month + '';
    if (month.length == 1) {
        month = "0" + month;
    }
    var datt = year + "-" + month + "-" + day;
    return datt
}
onMounted(async () => {
    date.value = formaData(new Date())
    await getData()
})
</script>

<style scoped></style>